<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>登录页面</title>
    <!--引入 bootstrap 弹窗的样式 -->
    <link rel="stylesheet" href="/bootstrap/css/bootstrap.min.css">
    <!--引入 Layer 弹窗的样式 -->
    <link rel="stylesheet" href="/layer/theme/default/layer.css"/>
    <!--引入 angularJS 分页的样式 -->
    <link rel="stylesheet" href="/angularjs/pagination.css">
    <!--引入 jquery 类库 -->
    <script src="/bootstrap/js/jquery.min.js"></script>
    <!--引入 bootstrap 类库 -->
    <script src="/bootstrap/js/bootstrap.min.js"></script>
    <!--引入 angular 的类库 -->
    <script src="/angularjs/angular.min.js"></script>
    <!--引入 Layer 弹窗的类库 -->
    <script src="/layer/layer.js"></script>
    <!--引入 angularJS 框架分页的类库 -->
    <script src="/angularjs/pagination.js"></script>
    <style>

        body{
            background: url(https://img.tukuppt.com/bg_grid/00/05/08/sBXHmUX4Sp.jpg) no-repeat ;
            background-size:cover;
        }

        .container {
            width: 500px;
            margin-right: 250px;
            margin-top: 170px;
        }

        .msg {
            border: 1px solid #FFB4A8;
            background-color: #FEF2F2;
            line-height: 32px;
        }
    </style>
</head>
<body ng-app="app" ng-controller="ctr">
<div class="container">
    <div class="panel panel-primary">
        <div class="panel-heading text-center">
            <h2>登录</h2>
        </div>
        <div class="panel-body">
            <form class="form-horizontal">
                <div class="form-group">
                    <div class="col-md-8 col-md-offset-2 input-group">
                        <div class="msg" ng-show="msg != ''">{{msg}}</div>
                    </div>
                </div>
                <div class="form-group">
                    <div class="col-md-8 col-md-offset-2 input-group">
                        <div class="input-group-addon"><span class="glyphicon glyphicon-user"></span></div>
                        <input id="userName" class="form-control " ng-model="user.userName" placeholder="请输入账号">
                    </div>
                </div>
                <div class="form-group ">
                    <div class="col-md-8 col-md-offset-2 input-group">
                        <div class="input-group-addon"><span class="glyphicon glyphicon-lock"></span></div>
                        <input id="password" class="form-control" type="password" ng-model="user.userPwd" placeholder="请输入登录密码">
                    </div>
                </div>
                <div class="form-group">
                    <div class="col-md-8 col-md-offset-2 input-group">
                        <button class="btn btn-success btn-block" ng-click="login()">登录</button>
                        <button class="btn btn-warning btn-block" ng-click="register()">注册</button>
                    </div>
                </div>
            </form>
        </div>
        <div class="panel-footer">
            <span>{{time|date:'yyyy-MM-dd HH:mm:ss'}}</span>
            <span style="float: right">&copy; 2021 SEA 版权所有</span>
        </div>
    </div>
</div>
<script>

    //开启跨域
    angular.module("app", ['ngCookies']).config(function ($httpProvider) {
        $httpProvider.defaults.useXDomain = true;
        delete $httpProvider.defaults.headers.common['X-Requested-With']
    })
        .controller("ctr", ["$scope", "$http", '$interval', function ($scope, $http, $interval) {

            $scope.user = {}; //用户登录信息
            $scope.msg = ""; //提示信息
            $scope.time = new Date(); //日期时间信息

            //显示日期时间
            $interval(function () {
                $scope.time = new Date();
            }, 1000);

            //登录
            $scope.login = function () {
                var userName = $scope.user.userName;
                var userPwd = $scope.user.userPwd;

                if (userName == null || userName == '') {
                    layer.tips('请输入账号', '#userName', {tips: [2, '#F92A2A']});
                    return;
                }
                if (userPwd == null || userPwd == '') {
                    layer.tips('请输入登录密码', '#password', {tips: [2, '#F92A2A']});
                    return;
                }
                $scope.msg = "";
                $http.post("http://localhost:12000/user/login", $scope.user).success(function (data) {
                    if (data.code == 200) {
                        $scope.msg = "";
                        localStorage.setItem("token", data.data);
                        window.location.href = "/views/stock/list.html";
                    } else {
                        $scope.msg = data.msg;
                    }
                })
            };

            //去注册页面
            $scope.register = function () {
                window.location.href = "/views/user/register.html";
            };



        }])
</script>
</body>
</html>